<template>
  <div id="wrapper">
    <div class="box">
      <div title="关闭窗口" @click="closeWindown"  class="btn close"><Icon type="ios-close" /></div>
      <div class="tit">海 草</div>
      <div class="contbox">
        <div class="logo"><Icons :size="40" name="haicao" /></div>
        <div class="boxs">
          <div class="tips">欢迎回来</div>
          <div class="input">
            <input type="text" v-model="username" placeholder="请输入账号">
            <Icons @click.native="openShowLogs" name="xiala2" />
            <div class="show_logs" v-show="login_logs && login_logs.length > 0 && usernamefocus">
              <div class="item" @click="setInput(item)" v-for="(item, index) in login_logs" :key="index" v-if="item.username.indexOf(username) == 0 && item.username != username">
                {{item.username}}
              </div>
            </div>
          </div>
          <div class="input">
            <input type="password" v-model="pwd" placeholder="请输入密码">
            <Icons name="mima" />
          </div>
          <div class="login_btn" @click="login">登录</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Tips from '../../assets/js/tips.js'

var loadingTips = new Tips({
  msg: '正在加载登录资源，请稍后...',
  type: 'loading'
})

export default {
  name: 'Login',
  data: () => {
    return {
      usernamefocus: false,
      loading: false,
      username: '',
      pwd: '',
      adminLogin: false,
      mobileLogin: false,
      login_logs: []
    }
  },
  async created () {
    var loginLogs = await this.$db.login_log.getLogs()
    this.login_logs = loginLogs
  },
  methods: {
    openShowLogs () {
      this.usernamefocus = !this.usernamefocus
    },
    closeWindown () {
      this.$electron.ipcRenderer.send('login_hide')
    },
    setInput (item) {
      this.username = item.username
      this.pwd = item.pwd

      this.usernamefocus = false
      this.$forceUpdate()
    },
    async login () {
      if (this.username === '' || this.pwd === '') {
        this.$Message.error('账号密码不能为空')
        return
      }
      this.loading = true
      var isLogin = await this.$db.user_login.nameTouser(this.username)
      if (isLogin.length > 0) {
        this.$Message.error('当前账号已登录，不要重复登录！')
        this.loading = false
        return
      }
      var data = {
        username: this.username,
        pwd: this.pwd,
        type: 1002,
        adminLogin: this.adminLogin,
        mobileLogin: this.mobileLogin
      }
      try {
        var result = await this.$fn.postLogin(data)
        if (result.status !== 1) {
          throw new Error('登录失败，请重试！')
        }
        await this.$db.login_log.addLogs({
          username: this.username,
          pwd: this.pwd
        })
        this.loading = false
        this.username = ''
        this.pwd = ''
        this.adminLogin = false
        this.mobileLogin = false
        loadingTips.show()
        var csuser = {
          cs_id: result.user_info.id,
          key: result.key,
          pwd: data.pwd,
          info: result.user_info
        }
        this.$electron.ipcRenderer.send('login_success', csuser)
        this.$electron.ipcRenderer.on('load_res_error', () => {
          loadingTips.hide()
          this.loading = false
          this.$Message.error('登录失败，请重试！')
        })
      } catch (e) {
        console.log(e)
        this.loading = false
        this.$Message.error('登录失败，请重试！')
      }
    }
  }
}
</script>

<style lang="less" scoped>
@import './style.less';
</style>
